<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  
<script>
export  function transDataToTreeData(){

 //遍历数组中所有的部门对象,给每个部门对象添加一个children属性
const mapObj={} //映射对象,方便根据数的关系找数据
  arr.forEach(item=>{
console.log(item,'item');
if(!item.children){
  item.children=[]
}
//往映射对象添加数据:取出没听过item对象的id作为映射对象的key,值就是当前的item
mapObj[item.id]=item
  })
console.log(mapObj,'mapObj')
//具体实现树形数据的转化
const new_arr=[] //保存树形的数据
arr.forEach(item=>{
  //根据数据的父子级关系,找到父级的数据
  const parent =mapObj[item.pid]
  //parent 如果undefind,就是说明item没有父级是一级的数据
  //parent如果有值就说明item是一个耳机数据或者三级数据,parent保存的是父级对象
  if (parent) {
    parent.children.push(item)
  }else{
    //parent如果是undefind,就是item没有父级是一级的数据
    new_arr.push(item)
  }
})
return new_arr
}
const arr=[
   { 'id': '29', 'pid': '',     'name': '总裁办' },
   { 'id': '2c', 'pid': '',     'name': '财务部' },
   { 'id': '2d', 'pid': '2c', 'name': '财务核算部'},
   { 'id': '2f', 'pid': '2c', 'name': '薪资管理部'},
   { 'id': 'd2', 'pid': '',     'name': '技术部'},
   { 'id': 'd3', 'pid': 'd2', 'name': 'Java研发部'}
 ]
transDataToTreeData( arr)
</script>
</body>
</html>